/**
 * commit复制按钮以及源文件按钮
 * @param {object} commitInfo 接口返回的commit对象
 * @param {object} pathResource [默认为{}] window.Force中属性
 * @param {string} resourcePath [默认为''] 若传此参数，则浏览文件按钮不是跳到文件列表，而是跳到这个文件
 * @param {boolean} isSrcBtnShow [默认为false] 若传此参数，则显示浏览文件按钮
 * @param {boolean} isCommitIdCursorDefault [默认为false] 若传此参数，则显示commitID不可点击
 */
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Balloon, Message } from '@teamix/ui';
import CopyToClipboard from 'react-copy-to-clipboard';
import track from 'utils/track';
import './index.scss';
import { YunxiaoIcon } from '@alife/devops-ui';
import SrcBtn from './srcBtn';
import intl from '../../locale';
import { navigate } from 'utils/router';

const { Tooltip } = Balloon;

export default class Btn extends React.Component {
  static propTypes = {
    searchCommitInfo: PropTypes.object,
    commitInfo: PropTypes.object,
    pathResource: PropTypes.object,
    resourcePath: PropTypes.string,
    trackPage: PropTypes.string,
    isSrcBtnShow: PropTypes.bool,
    isCommitIdCursorDefault: PropTypes.bool,
  };

  static defaultProps = {
    searchCommitInfo: {},
    commitInfo: {},
    pathResource: {},
    resourcePath: '',
    isSrcBtnShow: false,
    isCommitIdCursorDefault: false,
    trackPage: '',
  };

  onClickShaThenToCommitDetail = () => {
    if (this.props.href) {
      navigate(this.props.href);
    }
  };

  render() {
    const {
      searchCommitInfo,
      commitInfo,
      inCommitDetail,
      resourcePath,
      pathResource,
      isSrcBtnShow,
      isCommitIdCursorDefault,
      trackPage,
    } = this.props;

    return (
      <React.Fragment>
        <Button.Group className="commit-id-btns">
          <Button
            type="normal"
            component="a"
            className="commit-id-link-btn font-menlo"
            style={{ cursor: isCommitIdCursorDefault ? 'default' : 'pointer' }}
            onClick={this.onClickShaThenToCommitDetail}
          >
            {commitInfo.sha
              ? commitInfo.sha.slice(0, 8)
              : (commitInfo.id && commitInfo.id.slice(0, 8)) || ''}
            {searchCommitInfo.highlightTextMap && (
              <div
                dangerouslySetInnerHTML={{ __html: searchCommitInfo.highlightTextMap.commitId }}
              />
            )}
          </Button>
          <Tooltip
            trigger={
              <CopyToClipboard
                text={commitInfo.id || searchCommitInfo.docId}
                onCopy={() =>
                  Message.success({
                    title: intl.get({
                      id: 'code-assets.components.commitIdAndSrcBtns.CopiedSuccessfully',
                      defaultMessage: '复制成功',
                    }),
                  })
                }
              >
                <Button
                  type="normal"
                  className="commit-id-copy-btn"
                  onClick={(e) => {
                    e.stopPropagation();
                    track({
                      action: 'copy_commitid',
                      page: trackPage,
                    });
                  }}
                >
                  <YunxiaoIcon type="copy-line" />
                </Button>
              </CopyToClipboard>
            }
            align="b"
          >
            {`${intl.get({
              id: 'code-assets.src.utils.locale.Copy',
              defaultMessage: '复制',
            })}`}
          </Tooltip>
        </Button.Group>

        {isSrcBtnShow ? (
          <div className="src-btn-wrapper">
            <SrcBtn
              inCommitDetail={inCommitDetail}
              commitInfo={commitInfo}
              pathResource={pathResource}
              resourcePath={resourcePath}
              trackPage={trackPage}
            />
          </div>
        ) : null}
      </React.Fragment>
    );
  }
}
